import { Component } from 'react';
import { View } from '@tarojs/components';
import Taro from '@tarojs/taro';
import { getCateDetailList } from '@/service/apis/contrast/index';
import ProductList from '../components/ProductList';
// import { serviceCategorys, productCategorys } from '../contants';
import './index.scss';

export default class Index extends Component {
  state = {
    title: '比价',
    type: 'product',
    detailList: [],
  };
  componentDidMount = async () => {
    const querys: any = Taro.getCurrentInstance().router?.params;
    if (querys.type) {
      this.setState({
        type: querys.type,
      });
    }
    this.initTitle();
  };

  getDetailList = async (id: string) => {
    try {
      const { data } = await getCateDetailList({
        category_id: id,
      });
      console.log('data', data);
      this.setState({
        detailList: data.products,
      });
    } catch (err) {
      Taro.showToast({
        title: err.message,
        icon: 'none',
      });
    }
  };

  initTitle = () => {
    const query = Taro.getCurrentInstance().router?.params;
    console.log('query: ', query);
    if (query?.id) {
      this.getDetailList(query?.id);
    }
    if (query?.name) {
      this.setState({
        title: query.name,
      });
    }
  };

  render() {
    const { detailList, title, type } = this.state;
    return (
      <View className="contrast-category-container">
        <ProductList type={type} title={title} subTitle="/  比过再来买" list={detailList} />
      </View>
    );
  }
}
